<template>
	<view :class="{divide: divide, 'listItem': true}" @click="onClick">
		<image class="img" :src="img" mode=""></image>
		<view class="text">{{ text }}</view>
		<image class="img rightImg" src="../../static/right.png" mode=""></image>
	</view>
</template>

<script>
	export default {
		props: {
			btnRight: {
				type: Boolean,
				default: true
			},
			text: {
				type: String,
				default: '功能项'
			},
			img: {
				type: String,
				default: '../../static/index/camera.png'
			},
			targetPage: {
				type: String,
				default: ''
			},
			divide: {
				type: Boolean,
				default: false
			}
		},
		data() {
			return {
				
			};
		},
		methods: {
			onClick() {
				if (this.targetPage) {
					uni.navigateTo({
						url: this.targetPage
					})
				}
			}
		}
	}
</script>

<style lang="scss">
.listItem {
	display: flex;
	align-items: center;
	position: relative;
	padding: 13px 10px;
	background-color: $uni-bg-color;
	&:active {
		background-color: #F2EEEE;
	}
	&:nth-of-type(n+2) {
		border-top: 1px solid $uni-bg-page;
	}
	.img {
		width: 20px;
		height: 20px;
	}
	.text {
		margin: 0 10px;
	}
	.rightImg {
		position: absolute;
		right: 10px;
	}
}

.divide {
	margin-bottom: 5px;
}
</style>
